    <!-- Advance table -->
    <script src="<?=$url_styles?>js/plugins/tables/jquery.dataTables.min.js"></script>
    <script src="<?=$url_styles?>js/plugins/tables/colResizable-1.3.min.js"></script>
    <script src="<?=$url_styles?>js/plugins/tables/jquery.tablesorter.min.js"></script> 
    
    <script src="<?=$url_styles?>js/plugins/formselements/jquery.ibutton.min.js"></script>  
    <script src="<?=$url_styles?>js/plugins/formselements/ui.spinner.min.js"></script> 
    <script>
		var page=1;
        function load_table()
        {
            $.ajax({
               url: '<?=url_create('admin','group','read')?>',
               dataType: 'json',
               type: 'post',
			   data: {p: page},
               success: function(o)
               {
                   if(o.state=='success'){
                       var str='';
                       for(var i in o.data){
                           var r=o.data[i];
						   var row_class = (o.data[i].name==null || o.data[i].name=='')?'X':'A';
						   if(i%2==1) row_class+=" odd";
						   else row_class+=" even"
                           str+='<tr id="row_'+r.id+'" class="grade'+row_class+'">'+
                                  '<td>'+r.name+'</td>'+
                                  '<td>'+r.description+'</td>'+
                                  '<td class="center"><a data="'+r.id+'" class="btn btn-mini btn-success row_edit"><?=lang('edit')?></a>&nbsp;<button class="btn btn-mini btn-danger row_delete" data="'+r.id+'"><?=lang('delete')?></button></td>'+
                              '</tr>';
                       }

                       $('#table tbody').html(str);
					   
					   // Phan trang
					   var p = o.pagination;
					   var pnumbers = p.left?'...':'';
                       for(var i in p.pnumbers){
						   var clas = p.pnumbers[i]==p.curr?'active':'button';
						   pnumbers+='<a data="'+p.pnumbers[i]+'" class="paginate_'+clas+'">'+p.pnumbers[i]+'</a>';
					   }
					   if(p.right) pnumbers+='...';
					   $('#table_paginate span').html(pnumbers);
					   $('#table_previous').attr('data',p.prev);
					   $('#table_next').attr('data',p.next);
					   $('#table_first').attr('data',p.first);
					   $('#table_last').attr('data',p.last);
					   
                   }
               }
            });
        }
		$('#table_paginate a').live('click',function(e){
			var p = $(this).attr('data');
			if(p!=null){
				page=p;
				load_table();
			}
		});
        $('.row_delete').live('click',function(e){
            if(confirm('<?=lang('delete_confirm')?>'))
            {
                $.ajax({
                   url: '<?=url_create('admin','group','delete')?>',
                   type: 'post' ,
                   dataType: 'json',
                   data:{id: $(this).attr('data')},
                   success:function(o)
                   {
                       if(o.state == 'success')
                           $('#row_'+o.id).fadeOut(500);
                       else
                           $.jGrowl(o.message, {
                               header: o.title,
                               theme: "notification_styled_"+o.state 
                           });
                   }
                });
             }
        });
        
        $('.row_edit').live('click',function(e){
			$('#modal').attr('flag','edit');
			$('#modal').attr('data_id',$(this).attr('data'));
            $.ajax({
                url: '<?=url_create('admin','group','detail')?>',
                dataType: 'json',
                data: {id: $(this).attr('data')},
                success: function(o){
                    if(o.state=='success'){
                        
						// Ghi du lieu
						$('#name').attr('value',o.data.name);
						$('#description').val(o.data.description);
						$('.tab2_check').attr('checked',false);
						$('.permissions').attr('checked',false);
						
						for(var i in o.data.permissions){
							$('.permissions[value='+o.data.permissions[i]+']').attr('checked',true);
						}
						// Gan lai tieu de 
						$('#modal_title').html('<?=lang('group_update')?>');
                        $('#modal_toggle').click();
						
                        
                    }
                    else
                        $.jGrowl(data.message, {
                            header: o.title,
                            theme:"notification_styled_"+data.state 
                        });
                }
            })
        });
        
		$('.data_create').live('click',function(e){
			$('#modal').attr('flag','create');		
			// Reset field
			$('#name').attr('value','');
			$('#description').val('');
			$('.tab2_check').attr('checked',false);
			$('.permissions').attr('checked',false);
			// Gan tieu de modal
			$('#modal_title').html('<?=lang('group_create')?>');
			$('#modal_toggle').click();
		});
		$('#modal_ok').live('click',function(e){
			$('.modal-form').submit();
		});
        $('.modal-form').submit(function(e){
			var flag = $('#modal').attr('flag');
			var permissions = Array();
			var i=0;
			$('.permissions').each(function(){
				
				if(this.checked){
					permissions[i++]=this.value;
				} 
			})
			$.ajax({
				url: flag=='create'?'<?=url_create('admin','group','create')?>':'<?=url_create('admin','group','update')?>',
				dataType: 'json',
				type: 'post',
				data: {
					id: $('#modal').attr('data_id'),
					name: $('#name').attr('value'),
					permissions: permissions,
					description: $('#description').val()
				},
				success: function(o){
					if(o.state=='success'){
						load_table();
						$('#modal_toggle').click();
						$.jGrowl(o.message, {
							header: o.title,
							theme:"notification_styled_"+o.state 
						});
					}else{
						alert(o.message);
					}
					
				}
			});
            return false;
        });
		
        $('#modal_cancel').live('click',function(e){
            $('#modal_toggle').click();
        });
		
		$('.tab2_check').live('click',function(){
			$('.permissions').attr('checked',this.checked);
		})
        $(document).ready(function(){
			load_table();
			$.ajax({
				url: '<?=url_create('admin','permission','get_all')?>',
				dataType: 'json',
				type: 'post',
				success: function(o)
				{
					if(o.state=='success'){
						var str = '<label class="checkbox"><input type="checkbox" class="tab2_check"><b><?=lang('select_all')?></b></label>';
						for(var i in o.permissions){
							str+='<label class="checkbox">'+
									'<input type="checkbox" class="permissions" value="'+o.permissions[i].id+'" >'+
									o.permissions[i].name+
									'</label>';
						}
						$('#tab2').html(str);
					}
					else
					{
						alert(o.message);
					}
				}
			})
		});
    </script>
    